<template>
  <div>
    <a-divider v-if="index !== 0">或</a-divider>
    <div class="filter_item"  v-for="(item, index) in filter.data" :key="item.uuid">
      <workflow-filter 
        :filter="item"
        :output="output"
        @deleteFilter='handleDeleteFilter'
      ></workflow-filter>
      <span v-show="index !== filter.data.length - 1">且</span>
    </div>
    <a-button @click="addFilter">且</a-button>
    <a-button v-if="showOr" @click="handleAddOrFilter">或</a-button>
  </div>
</template>

<script>
import WorkflowFilter from './workflowFilter.vue'
export default {
    props: {
      filter: Array,
      index: Number,
      showOr: Boolean,
      output: Object,
    },
    components:{
      WorkflowFilter
    },
    data(){
      return {
        filterArray: []
      }
    },
    watch:{
    },
    mounted(){
      this.filterArray = this.filter.data
    },
    methods:{
      handleDeleteFilter(uuid){
        this.$emit('deleteChildFilter', this.filter.uuid, uuid)
      },
      addFilter(){
        this.$emit('addChildFilter', this.filter.uuid)
      },
      handleAddOrFilter(){
        this.$emit('addFilter')
      },
    }
}
</script>

<style lang="less">
</style>